import * as echarts from 'echarts'
var xData2 = ["新梢生长长度", "叶绿面积", "新梢生长宽度", "叶片挺度"];
var data1 = [285, 686, 321, 868];
var data2 = [1000, 1000, 1000, 1000];

const option = {
    backgroundColor: 'transparent',
    xAxis: {
        data: xData2,
        axisTick: {
            show: false
        },
        axisLine: {
            show: false
        },
        axisLabel: {
            interval: 0,
            textStyle: {
                color: '#fff',
                fontSize: 12,
            },
            margin: 20
        },

    },
    tooltip: {
        trigger: 'item',
        backgroundColor: '#070724bf',
        borderColor: '#00ffea59',
        textStyle: {
            color: '#00FFEA',
            fontSize: 12
        }
    },
    grid: {
        top: '5%',
        left: '-15%',
        right: '4%',
        bottom: '5%',
        containLabel: true
    },
    yAxis: {
        show: false,
        splitLine: {
            show: false,
        },
        axisTick: {
            show: false
        },
        axisLine: {
            show: false
        },
        axisLabel: {
            textStyle: {
                color: '#fff',
                fontSize: 20,
            },
        }
    },
    series: [
        {//三个最低下的圆片
            "name": "",
            "type": "pictorialBar",
            "symbolSize": [60, 15],
            barWidth: 60,
            "symbolOffset": [0, 10],
            "z": 12,
            itemStyle: {
                opacity: 1,
                color: function (params) {
                    var index = params.dataIndex
                    switch (index) {
                        case 0:
                            return '#cfaa58'
                        case 1:
                            return '#199bd3'
                        case 2:
                            return '#5d95d8'
                        case 3:
                            return '#0143b2'
                    }
                }
            },
            "data": [1, 1, 1, 1, 1]
        },
        //下半截柱状图
        {
            name: '2020',
            type: 'bar',
            barGap: '-100%',
            barWidth: 60,
            itemStyle: {//lenged文本
                opacity: .7,
                color: function (params) {
                    var index = params.dataIndex
                    switch (index) {
                        case 0:
                            return '#cfaa58'
                        case 1:
                            return '#199bd3'
                        case 2:
                            return '#5d95d8'
                        case 3:
                            return '#0143b2'
                    }
                }
            },

            data: data1
        },

        { // 替代柱状图 默认不显示颜色，是最下方柱图（邮件营销）的value值 - 20
            type: 'bar',
            barWidth: 60,
            barGap: '-100%',
            stack: '广告',
            itemStyle: {
                color: 'transparent'
            },
            label: {
                normal: {
                    show: true,
                    position: 'inside',
                    textStyle: {
                        color: '#fff',
                        fontSize:'13'
                    },
                }
            },
            data: data1
        },

        {
            "name": "", //头部
            barWidth: 60,
            "type": "pictorialBar",
            "symbolSize": [60, 15],
            "symbolOffset": [0, -10],
            "z": 12,
            "symbolPosition": "end",
            itemStyle: {
                color: '#163F7A',
                opacity: 1,
            },
            "data": data2
        },

        {
            "name": "",
            "type": "pictorialBar",
            barWidth: 60,
            "symbolSize": [60, 15],
            "symbolOffset": [0, -10],
            "z": 12,
            itemStyle: {
                opacity: 1,
                color: function (params) {
                    var index = params.dataIndex
                    switch (index) {
                        case 0:
                            return '#cfaa58'
                        case 1:
                            return '#199bd3'
                        case 2:
                            return '#5d95d8'
                        case 3:
                            return '#0143b2'
                    }
                }
            },
            "symbolPosition": "end",
            "data": data1
        },

        {
            name: '2019',
            type: 'bar',
            barWidth: 60,
            barGap: '-100%',
            z: 0,
            itemStyle: {
                color: '#163F7A',
                opacity: .7,
            },
            data: data2
        }


    ]
};
export default option